
/**
 * 实现复选框
 */

/*基本思路：
        1、创建一个隐藏的option，添加到select的最后；
        2、每次选中的值都存入这个option，如果已经选中，当再次选择时，就会删掉；
        3、若已选择了值，就将隐藏的option的selected属性设置为true，以便获取多选内容
*/

// 全局选中数组,存储添加的内容
var addUserRole = [];
var addDepartment = [];
var addProvideOrg = [];

document.getElementById("addUserRole").addEventListener('input',function (){
    //获取当前选择的值
    let value = this.options[this.selectedIndex].value;
    //判断是否被选择，返回-1说明没选择，否则已被选择
    let index = addUserRole.indexOf(value);
    //若已选择，就删除该选择，并且将option的背景恢复为未被选择的状态
    if(index>-1){
        addUserRole.splice(index,1);
    }else {
        //没选择就将该值push到values中
        addUserRole.push(value);
    };
    optHidden = document.getElementById("addUserRoleSelected");
    //将selectedArr数组中的数据转化成字符串的格式赋给隐藏的option
    optHidden.innerText = addUserRole.join("|");
    //将隐藏的option的selected属性设置为true，这样select.value获取的值就是多选选中的值
    if(addUserRole.length>0){
        optHidden.selected=true;
    }
});

document.getElementById("addDepartment").addEventListener('input',function (){
    //获取当前选择的值
    let value = this.options[this.selectedIndex].value;
    //判断是否被选择，返回-1说明没选择，否则已被选择
    let index = addDepartment.indexOf(value);
    //若已选择，就删除该选择，并且将option的背景恢复为未被选择的状态
    if(index>-1){
        addDepartment.splice(index,1);
    }else {
        //没选择就将该值push到values中
        addDepartment.push(value);
    };
    optHidden = document.getElementById("addDepartmentSelected");
    //将selectedArr数组中的数据转化成字符串的格式赋给隐藏的option
    optHidden.innerText = addDepartment.join("|");
    //将隐藏的option的selected属性设置为true，这样select.value获取的值就是多选选中的值
    if(addDepartment.length>0){
        optHidden.selected=true;
    }
});

document.getElementById("addProvideOrg").addEventListener('input',function (){
    //获取当前选择的值
    let value = this.options[this.selectedIndex].value;
    addProvideOrg[0] = value;
    optHidden = document.getElementById("addProvideOrgSelected");
    //将selectedArr数组中的数据转化成字符串的格式赋给隐藏的option
    optHidden.innerText = addProvideOrg.toString();
    //将隐藏的option的selected属性设置为true，这样select.value获取的值就是多选选中的值
    if(addProvideOrg.length>0){
        optHidden.selected=true;
    }
});